<template>
  <div class="siteDataLook-main">
    <div class="infor">
      <span>站点基本信息</span>
      <transition name="el-zoom-in-center">
        <div class="content" v-show="flagBase">
            <c-row>
              <c-col :span="8">
                <span>站点名称：</span>
                <span>关税站点</span>
              </c-col>
              <c-col :span="8">
                <span>站点编号：</span>
                <span>hzgs001</span>
              </c-col>
              <c-col :span="8">
                <span>站点状态：</span>
                <span>启用</span>
              </c-col>
            </c-row>
          <c-row>
            <c-col :span="8">
              <span>创建时间：</span>
              <span>关税站点</span>
            </c-col>
            <c-col :span="16">
              <span>站点链接：</span>
              <span>hzgs001</span>
            </c-col>
          </c-row>
          <c-row>
            <c-col>
              <span>站点描述：</span>
              <span>关税站点是专项服务于关税人员业务分析需求而设定的，为关税业务人员提供数据和分析工具的支持。关税站点是专项服务于关税人员业务分析需求而设定的，为关税业务人员提供数据和分析工具的支持。</span>
            </c-col>
          </c-row>
        </div>
      </transition>
      <div class="btn-style">
        <c-button v-if="flagBase" icon="el-icon-arrow-down" type="primary" @click="flagBase = !flagBase" >隐藏</c-button>
        <c-button v-else icon="el-icon-arrow-up" type="primary" @click="flagBase = !flagBase" >展开</c-button>
      </div>
    </div>
    <div class="infor">
      <span>条件信息</span>
      <transition name="el-zoom-in-center">
        <div class="content contentexp" v-show="conBase">
          <c-row>
            <c-col>
              <span>管理员：</span>
              <span>张三（总署/杭州关/关税处/处领导）/李四（总署/杭州关/关税处/处领导）张三（总署/杭州关/关税处/处领导）/李四（总署/杭州关/关税处/处领导）张三（总署/杭州关/关税处/处领导）/李四（总署/杭州关/关税处/处领导）张三（总署/杭州关/关税处/处领导）/李四（总署/杭州关/关税处/处领导）张三（总署/杭州关/关税处/处领导）/李四（总署/杭州关/关税处/处领导）</span>
            </c-col>
          </c-row>
          <c-row>
            <c-col>
              <span>授权人员信息：</span>
              <span>张三（总署/杭州关/关税处/原产地科）/马三（总署/杭州关/关税处/财务科）赵六（总署/杭州关/关税处/原产地科）/田七（总署/杭州关/关税处/商品科）张三（总署/杭州关/关税处/原产地科）/马三（总署/杭州关/关税处/财务科）赵六（总署/杭州关/关税处/原产地科）/田七（总署/杭州关/关税处/商品科）张三（总署/杭州关/关税处/原产地科）/马三（总署/杭州关/关税处/财务科）赵六（总署/杭州关/关税处/原产地科）/田七（总署/杭州关/关税处/商品科）</span>
            </c-col>
          </c-row>
        </div>
      </transition>
      <div class="btn-style">
        <c-button v-if="conBase" icon="el-icon-arrow-down" type="primary" @click="conBase = !conBase" >隐藏</c-button>
        <c-button v-else icon="el-icon-arrow-up" type="primary" @click="conBase = !conBase" >展开</c-button>
      </div>
    </div>
    <div class="infor">
      <span>站点权限信息</span>
      <div class="content contentexp">
        <c-row>
          <c-col :span="8">
            <span>数据源：</span>
            <span>关税站点</span>
          </c-col>
          <c-col :span="8">
            <span>引用模板：</span>
            <span>hzgs001</span>
          </c-col>
          <c-col :span="8">
            <span>数据权限范围：</span>
            <span>启用</span>
          </c-col>
        </c-row>
        <c-row>
          <c-col :span="8">
            <span>允许新建机构：</span>
            <span>关税站点</span>
          </c-col>
          <c-col :span="16">
            <span>允许新建人员：</span>
            <span>hzgs001</span>
          </c-col>
        </c-row>
        <c-row>
          <c-col>
            <span>数据组：</span>
            <span>关税站点是专项服务于关税人员业务分析需求而设定的，为关税业务人员提供数据和分析工具的支持。关税站点是专项服务于关税人员业务分析需求而设定的，为关税业务人员提供数据和分析工具的支持。</span>
          </c-col>
        </c-row>
      </div>
    </div>
    <div class="btn-style-mid">
      <c-button icon="el-icon-circle-close-outline" @click="handleReturn" >返回</c-button>
    </div>
  </div>
</template>

<script>
  import request from '@/utils/request.js'
  export default {
    name: "siteDataLook",
    data() {
      return {
        businessobjectUrl: '/v1/yq/meatbustype/query',
        flagBase: true,
        conBase: true
      }
    },
    computed: {
      projectId() {
        return this.$route.params['projectId']
      }
    },
    created() {
      this.getInfo({ projectId: this.projectId })
    },
    methods: {
      getInfo(params) {
        return new Promise((resolve) => {
          request({
            url: this.businessobjectUrl,
            method: 'get',
            params
          })
            .then(({ success, data }) => {
              if (success) {
                if (data) {
console.log('控制台---------', data)
                }
                resolve(this.bustypes)
              } else {
                this.$message({
                  type: 'error',
                  message: '获取数据组详情失败！'
                })
              }
            })
        })
      },

      // 返回
      handleReturn() {
        this.$router.push({
          path: `/siteconfig/sitemanage`
        })
      }
    }
  }
</script>

<style lang="scss">
  .siteDataLook-main{
    box-sizing: border-box;
    padding: 20px 40px 20px 20px;
    height: auto;
    overflow: hidden;
    .infor {
      >span{
        box-sizing: border-box;
        display: inline-block;
        font-weight:bold;
        font-size: 16px;
        border-bottom: 1px solid rgba(222,222,222,1);
        width: 100%;
        padding: 10px 20px;
      }
    }
    .content{
      padding: 25px 20px;
      .el-row{
        margin-bottom: 25px;
      }
      span{
        font-size: 14px;
        color: #666666;
        line-height: 1.5;
      }
    }
    .contentexp{
      .el-row .el-col span:first-child{
        display: inline-block;
        width: 120px;
      }
    }

    .btn-style{
      margin-top: 20px;
      display: flex;
      justify-content: flex-end;
    }

    .btn-style-mid{
      display: flex;
      justify-content: center;
    }
  }
</style>
